import { connect } from 'dva'

import AekTable from '@/components/AekTable'
import AekUpload from '@/components/AekUpload'
import PageLayout from '@/components/PageLayout'
import SearchForm from '@/components/SearchForm'
import { namespace } from '@/models/pcs/companionFeedback'
import { getPagination } from '@/utils/antdHelper'
import { getBasicFn } from '@/utils/dvaUtil/index'

/** 陪护 - 反馈与建议管理 */
const Index = ({ modelState, loading }) => {
  const { pageList, pagination, searchParams } = modelState
  const { toAction, getLoading } = getBasicFn({ namespace, loading })

  /** @type {import("@/components/SearchForm").SearchFormProps} */
  const searchProps = {
    searchParams,
    formData: [
      {
        field: 'phone',
        label: '手机号',
        component: {
          name: 'Input',
        },
      },
      {
        field: 'createTime',
        label: '提交时间',
        component: {
          name: 'RangePicker',
        },
      },
    ],
    onSearch: values => {
      toAction({ searchParams: values })
      toAction({ pagination: { current: 1 } }, true)
      toAction('getPageList')
    },
  }

  /** @type {import("@/components/AekTable").AekTableProps} */
  const tableProps = {
    configKey: namespace,
    rowKey: 'id',
    loading: getLoading('getPageList'),
    dataSource: pageList,
    pagination: getPagination(pagination, (current, pageSize) => {
      toAction('getPageList', { current, pageSize })
    }),
    columns: [
      { dataIndex: 'message', title: '反馈内容', ellipsis: true },
      {
        dataIndex: 'fileUrl',
        title: '图片',
        render: fileUrl => {
          return fileUrl ? (
            <AekUpload
              value={fileUrl}
              listType='picture-card'
              limitFileNum={0}
              stackingThumb
              showUploadList={{ showRemoveIcon: false }}
            />
          ) : (
            '-'
          )
        },
      },
      { dataIndex: 'phone', title: '手机号' },
      { dataIndex: 'createTime', title: '提交时间', isDateTime: true },
    ],
  }

  return (
    <PageLayout>
      <SearchForm {...searchProps} />
      <AekTable {...tableProps} />
    </PageLayout>
  )
}

export default connect(store => ({
  modelState: store[namespace],
  loading: store.loading,
}))(Index)
